﻿<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<% 
	String ctx = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0 minimal-ui"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>南网图讯-下载</title>
    <link type="text/css" href="<%=ctx%>/zenithsun/news/mobile/css/mobile.css" rel="stylesheet">
    <script type="text/javascript" src="<%=ctx%>/baseNew/plugins/jQuery/jQuery-2.2.0.min.js"></script>
    <script type="text/javascript" src="<%=ctx%>/zenithsun/news/mobile/js/jquery.touchSwipe.min.js"></script>
</head>
<body>
<div class="m-index">
    <div class="page page1">
        <img src="<%=ctx%>/zenithsun/news/mobile/images/m-01.jpg" alt=""/>
        <div class="m-down-btn">
            <div class="m-items fn-tac">
            	<%-- <img src="<%=ctx%>/zenithsun/news/mobile/images/ios.png" /> --%>
                <a href="<%=ctx%>/zenithsun/news/mobile/images/ios.png"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-ios.png" /></a> 
            </div>
            <div class="m-items fn-tac">
                <a href="<%=ctx%>/path/basicdata/downloadAppByType?type=Android"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-adr.png" /></a>
            </div>
            <div class="m-items m-fot-items fn-tac"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-fot.png" /></div>
        </div>
    </div>
    <div class="page page2"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-02.jpg" alt=""/> </div>
    <div class="page page3"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-03.jpg" alt=""/> </div>
    <div class="page page4"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-04.jpg" alt=""/> </div>
    <div class="page page1">
        <img src="<%=ctx%>/zenithsun/news/mobile/images/m-01.jpg" alt=""/>
        <div class="m-down-btn">
            <div class="m-items fn-tac">
                <a href="<%=ctx%>/path/basicdata/downloadAppByType?type=IOS"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-ios.png" /></a>
            </div>
            <div class="m-items fn-tac">
                <a href="<%=ctx%>/path/basicdata/downloadAppByType?type=Android"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-adr.png" /></a>
            </div>
            <div class="m-items m-fot-items fn-tac"><img src="<%=ctx%>/zenithsun/news/mobile/images/m-fot.png" /></div>
        </div>
    </div>

</div>
<script type="text/javascript">
    $(document).ready(
            function() {
                var nowpage = 0;
                //给最大的盒子增加事件监听
                $(".m-index").swipe(
                        {
                            swipe:function(event, direction, distance, duration, fingerCount) {
                                if(direction == "up"){
                                    nowpage = nowpage + 1;
                                }else if(direction == "down"){
                                    nowpage = nowpage - 1;
                                }
                                if(nowpage > 4){
                                    nowpage = 4;
                                }
                                if(nowpage < 0){
                                    nowpage = 0;
                                }
                                $(".m-index").animate({"top":nowpage * -100 + "%"},400);
                                $(".page").eq(nowpage).addClass("cur").siblings().removeClass("cur");
                            }
                        }
                );
            }
    );
</script>
</body>
</html>